<template>
  <div class="app-container ">
    <h3>MM004Ij 采购收货-结果</h3>

    <template v-if="false">
      <el-select v-model="selectedFileType" disabled placeholder="请选择文件类型">
        <el-option
          v-for="fileType in fileTypes"
          :key="fileType.value"
          :label="fileType.label"
          :value="fileType.value"
        />
      </el-select>

      <el-upload
        disabled
        class="upload-demo"
        action="#"
        :show-file-list="false"
        :on-change="handleChange"
      >
        <el-button slot="trigger" disabled size="small" type="primary">点击上传文件</el-button>
      </el-upload>
    </template>

    <el-table
      v-if="data.length > 0"
      :data="data"
      border
      style="width: 100%; margin-top: 20px;"
      size="medium"
    >

      <el-table-column prop="id" label="执行结果" width="50" align="center">
        <template slot-scope="scope">
          <!--          <el-link type="primary">编辑</el-link>-->
          <i class="el-icon-success" style="color: red;" />
        </template>
      </el-table-column>

      <el-table-column prop="id" label="行序号" />
      <el-table-column
        v-for="(column,index) in visibleColumns"
        :key="column.prop"
        :prop="column.prop"
        :label="`${index + 1}. ${column.label}`"
        width="180"
      />
    </el-table>
  </div>
</template>

<script>
import { fetchFileData } from '@/api/basics'

export default {
  name: 'MM004Ij',
  props: ['ppath'],
  data() {
    return {
      data: [],
      selectedFileType: '', // Selected file type
      fileTypes: [
        { label: '收货（收货指令）', value: 'receipt' },
        { label: '收货（收货结果）', value: 'receipt_result' }
        // { label: '其他文件类型', value: 'other' }
        // Add more file types as needed
      ]
    }
  },
  computed: {
    visibleColumns() {
      return [
        { 'prop': 'ReceiptID', 'label': '收据指令号' },
        { 'prop': 'OrgID', 'label': '货物收据工厂代码' },
        { 'prop': 'ShipFrom', 'label': '发货方ID' },
        { 'prop': 'ShipTo', 'label': '收货方ID（客户主数据）' },
        { 'prop': 'SellerID', 'label': '销售方ID' },
        { 'prop': 'BuyerID', 'label': '采购方ID（客户主数据）' },
        { 'prop': 'ReceiptType', 'label': '收据类型' },
        { 'prop': 'ReceiptCode', 'label': '收据编号' },
        { 'prop': 'ReceiveDate', 'label': '货物收据日期' },
        { 'prop': 'RelatedTranType', 'label': '相关交易类型' },
        { 'prop': 'RefrenceNo', 'label': '参考编号' },
        { 'prop': 'Comments', 'label': '备注' },
        { 'prop': 'WareHouseID', 'label': '存储位置ID' },
        { 'prop': 'ReceiptDetailID', 'label': '收据指令细节编号' },
        { 'prop': 'ReceiptID1', 'label': '收据指令编号' },
        { 'prop': 'ItemID', 'label': '物料号码' },
        { 'prop': 'DeliveryDetailID', 'label': '交货细节ID' },
        { 'prop': 'OrderID', 'label': '订单编号' },
        { 'prop': 'OrderDetailID', 'label': '订单项目编号' },
        { 'prop': 'QtyShipped', 'label': '已发货数量' },
        { 'prop': 'QtyReceived', 'label': '收到货物数量' },
        { 'prop': 'QtyInspected', 'label': '检验通过数量' },
        { 'prop': 'QtyAccepted', 'label': '接受数量' },
        { 'prop': 'QtyInvalid', 'label': '无效数量' },
        { 'prop': 'ComplaintReasonCode', 'label': '投诉原因代码' },
        { 'prop': 'InvStatus', 'label': '库存状态' },
        { 'prop': 'Comments_UoM', 'label': '计量单位的备注' },
        { 'prop': 'WarehouseID', 'label': '存储位置ID' },
        { 'prop': 'BaseQty', 'label': 'GR数量中的基础数量' },
        { 'prop': 'MovementType', 'label': '移动类型' },
        { 'prop': 'ValuationType', 'label': '估价类型' }
      ]
    }
  },
  created() {
    this.getfetchFileData()
  },
  methods: {
    async getfetchFileData() {
      const response = await fetchFileData({
        'name': 'MM004Ij',
        'path': this.ppath
      })
      this.data = response.data
    },
    handleChange(file, fileList) {
      const reader = new FileReader()
      reader.onload = (event) => {
        const text = event.target.result.replace(/\n$/, '')

        if (this.selectedFileType === 'receipt') {
          this.parseText(text) // Call function to parse text data
        } else if (this.selectedFileType === 'receipt_result') {
          this.parseText1(text) // Call function to parse text data
        }
      }
      reader.readAsText(file.raw)
    },
    parseText1(text) {
      const lines = text.split('\n')
      const parsedData = lines.map((line, index) => {
        const fields = line.split('\t')
        return {
          id: index + 1, // Generate ID based on index (you can adjust as needed)
          ReceiptID: fields[0],
          OrgID: fields[1],
          ShipFrom: fields[2],
          ShipTo: fields[3],
          SellerID: fields[4],
          BuyerID: fields[5],
          ReceiptType: fields[6],
          ReceiptCode: fields[7],
          ReceiveDate: fields[8],
          RelatedTranType: fields[9],
          RefrenceNo: fields[10],
          Comments: fields[11],
          WareHouseID: fields[12],
          ReceiptDetailID: fields[13],
          ReceiptID1: fields[14],
          ItemID: fields[15],
          DeliveryDetailID: fields[16],
          OrderID: fields[17],
          OrderDetailID: fields[18],
          QtyShipped: fields[19],
          QtyReceived: fields[20],
          QtyInspected: fields[21],
          QtyAccepted: fields[22],
          QtyInvalid: fields[23],
          ComplaintReasonCode: fields[24],
          InvStatus: fields[25],
          Comments_UoM: fields[26],
          WarehouseID: fields[27],
          BaseQty: fields[28],
          MovementType: fields[29],
          ValuationType: fields[30]
          // InvoiceNumber: fields[31],
          // VendorItemCode: fields[32]
        }
      })
      this.data = parsedData
    },
    parseText(text) {
      const lines = text.split('\n')
      const parsedData = lines.map((line, index) => {
        const fields = line.split('\t')
        return {
          id: index + 1, // Generate ID based on index (you can adjust as needed)
          ReceiptID: fields[0],
          OrgID: fields[1],
          ShipFrom: fields[2],
          ShipTo: fields[3],
          SellerID: fields[4],
          BuyerID: fields[5],
          ReceiptType: fields[6],
          ReceiptCode: fields[7],
          ReceiveDate: fields[8],
          RelatedTranType: fields[9],
          RefrenceNo: fields[10],
          Comments: fields[11],
          WareHouseID: fields[12],
          ReceiptDetailID: fields[13],
          ReceiptID1: fields[14],
          ItemID: fields[15],
          DeliveryDetailID: fields[16],
          OrderID: fields[17],
          OrderDetailID: fields[18],
          QtyShipped: fields[19],
          QtyReceived: fields[20],
          QtyInspected: fields[21],
          QtyAccepted: fields[22],
          QtyInvalid: fields[23],
          ComplaintReasonCode: fields[24],
          InvStatus: fields[25],
          Comments_UoM: fields[26],
          WarehouseID: fields[27],
          BaseQty: fields[28],
          MovementType: fields[29],
          ValuationType: fields[30],
          InvoiceNumber: fields[31],
          VendorItemCode: fields[32]
        }
      })
      this.data = parsedData
    }
  }
}
</script>

<style scoped>
.upload-demo {
  margin-bottom: 20px;
}
</style>
